<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>绑定邮箱</title>
    <!--css style-->
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/font.css">
    <link rel="stylesheet" href="responsive/flexible.css">
    <script src="responsive/flexible.js"></script>
</head>
<body class="personal_center bind bind_mail">
    <header>
        <a href="javascript:void(0)" class="pre_page"></a>
        绑定邮箱
    </header>

    <section class="main">
        <div class="container">
            <form action="" class="form_mail">
                <h2>请输入您的邮箱地址</h2>
                <input type="text" name="mail" id="mail">
                <p class="red">系统已将向您的邮箱发送了验证邮件，请登录邮箱点击
                    验证链接即可完成邮箱绑定！</p>
                <input type="submit" value="立即绑定" onclick="checkEmail()">
            </form>
        </div>
    </section>


</body>
<script src="js/jquery.js"></script>
<script>
    /**
     * 校验邮箱
     */
    function checkEmail(){
        var errorFlag = true;
        var errorMessage ="";
        var value = $("#mail").val();
        if(value!=''){
            if (value.length > 50) {
                errorFlag = true;
                errorMessage = "邮箱长度不能大于50位";
            }
            var myReg=/(^\s*)\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*(\s*$)/;
            if(!myReg.test(value)){
                errorFlag=true;
                errorMessage = "邮箱格式不正确";
            }else{
                errorFlag=false;
            }
        }

        if(errorFlag){
            alert(errorMessage||"请输入您的邮箱");

        }else{
            $("p.red").show();
        }
        $(".form_mail").submit(false);
        return errorFlag;

    }
</script>
</html>